<template>
	<!-- 学习 -->
	<view class="recording">
		<view class="header">
			<view class="status_title">
				<text></text>
				<view class="status_center">直播课程</view>
				<text class="save"></text>
			</view>
		</view>
		<view class="content">
			<z-paging ref="paging" v-model="liveList" @query="queryList" :default-page-size="10">
				<view class="paping-main">
					<LiveItemClassComponent :classInfo="item" v-for="(item, i) in liveList" :key="i" />
				</view>
			</z-paging>
		</view>
	</view>
</template>

<script>
import { selectLiveList, selectUserViewList } from '@/services/course.js';
import LiveItemClassComponent from '@/components/liveItem/index.vue';
import MdItemlineClassComponent from '@/components/mdItemline/index.vue';
export default {
	components: {
		LiveItemClassComponent,
		MdItemlineClassComponent
	},
	data() {
		return {
			items: ['我的课程', '直播课'],
			current: 0,
			liveList: [], //直播列表
		};
	},
	onShow() {
		this.getLiveList(1);
	},
	methods: {
		onClickItem(e) {
			if (this.current !== e.currentIndex) {
				this.current = e.currentIndex;
				this.$refs.paging.reload();
			}
		},
		queryList(pageNo, pageSize) {
			this.getLiveList(pageNo);
		},

		async getLiveList(pageNo) {
			const res = await selectLiveList({ pageNum: pageNo, pageSize: 10, liveType: '' });
			if (res.code == 200) {
				this.liveVideo = res.rows;
				this.total = res.total || 0;
				console.log(this.$refs.paging, 'dadna');
				this.$refs.paging.completeByTotal(res.rows, res.total);
			}
		}
	}
};
</script>

<style lang="scss" scoped>
.recording {
	background-color: #F2F3F7;
	height: 100vh;
	.header {
		color: #000000;
		.status_bar {
			/* height: var(--status-bar-height); */
			width: 100%;
		}
		/* 自定义导航栏 */
		.status_title {
			box-sizing: border-box;
			display: flex;
			justify-content: space-between;
			align-items: center;
			width: 100%;
			height: 100.061rpx;
			padding: 0 16px;
			background-color: #ffffff;
		}
		.status_left {
			width: 24px !important;
		}
		.status_center {
			font-size: 17px;
			font-weight: 700;
		}
		.status_right {
			width: 22px;
		}
		.save {
			color: #0fb09b;
			font-size: 20rpx;
		}
		
	}
	::v-deep {
		.z-paging-content {
			top: 100px !important;
			background-color: #f2f3f7;
		}
		.paping-main{
			padding: 16px;
		}
	
	}
}


</style>
